<template>
  <div class="modal fade lookModal"
       id="lookModal"
       tabindex="-1"
       role="dialog"
       aria-labelledby="myModalLabel"
       aria-hidden="true">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <h4 class="modal-title title"
              id="myModalLabel">经纪人注册信息审核</h4>
        </div>
        <div class="modal-body">
          <div class="form-horizontal">
            <div class="form-group">
              <label class="col-sm-4 control-label">姓名：</label>
              <div class="col-sm-8 contentText">{{roleModal.userName || ''}}
              </div>
            </div>
            <div class="form-group">
              <label class="col-sm-4 control-label">手机号：</label>
              <div class="col-sm-8 contentText">{{roleModal.phone || ''}}
              </div>
            </div>
            <div class="form-group">
              <label class="col-sm-4 control-label">部门：</label>
              <div class="col-sm-8 contentText">{{roleModal.deptName || ''}}
              </div>
            </div>
            <div class="form-group"
                 v-for="item in roleModal.modelInfoResDtoList">
              <label class="col-sm-4 control-label">{{item.name}}：</label>
              <div class="col-sm-8 contentText"
                   v-if="item.displayType==='1' && item.value">
                <img :src="item.value"
                     alt="">
              </div>
              <div class="col-sm-8 contentText"
                   v-else>{{item.value || ''}}
              </div>
            </div>
            <!-- <hr style="height:1px;margin:5px 110px"> -->
            <div class="form-group">
              <label class="col-sm-4 control-label">审核意见：</label>
              <div v-if="editModal"
                   class="col-sm-8 contentText">
                <RadioGroup v-model="roleModal.checkStatus">
                  <Radio label="2"
                         style="margin-right:50px;">通过</Radio>
                  <Radio label="1">不通过</Radio>
                </RadioGroup>
              </div>
              <div v-else
                   class="col-sm-8 contentText">{{roleModal.checkStatus| filterStatus}}
              </div>
            </div>
            <div class="form-group">
              <label class="col-sm-4 control-label">备注：</label>
              <div v-if="editModal"
                   class="col-sm-8">
                <Input v-model="roleModal.remark"
                       style="width:70%"
                       show-word-limit
                       type="textarea"
                       :rows="4"
                       :maxlength="20"
                       placeholder="请输入备注，不超过20字" />
              </div>
              <div v-else
                   class="col-sm-8 contentText">{{roleModal.remark || ''}}
              </div>
            </div>
          </div>
        </div>
        <div class="modal-footer modal-footerRight">
          <button v-if="editModal"
                  type="button"
                  class="btn btn-default"
                  data-dismiss="modal">取消</button>
          <button v-if="editModal"
                  type="button"
                  class="btn checkedBtn"
                  @click="saveModal">确定</button>
          <button v-if="!editModal"
                  type="button"
                  class="btn checkedBtn"
                  @click="closeModal">关闭</button>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  //接收父组件的绑定值
  props: ["roleModal", "editModal", "saveReturn"],
  data() {
    return {};
  },
  filters: {
    filterStatus(v) {
      if (v === "1") {
        return "不通过";
      } else if (v === "2") {
        return "通过";
      } else if (v === "0") {
        return "待审核";
      }
    }
  },
  methods: {
    closeModal() {
      $("#lookModal").modal("hide");
    },
    saveModal() {
      const params = {
        checkStatus: this.roleModal.checkStatus,
        checkUserId: this.roleModal.checkUserId,
        remark: this.roleModal.remark
      };
      var url = this.utilHelper.apiUrl + "/api/partnerCheck";
      this.$http
        .post(url, { params })
        .then((response) => {
          if (response.body.result === "1") {
            layer.msg("保存成功", {
              time: 2000
            });
            this.$emit("saveReturn");
          } else {
            layer.msg(response.body.errorMsg, {
              time: 2000
            });
            return false;
          }
        })
        .catch((err) => {
          layer.msg("保存失败", {
            time: 2000
          });
          return false;
        });
    }
  }
};
</script>
<style lang="less" scoped>
.lookModal {
  .title {
    text-align: center;
  }
  .modal-body {
    .contentText {
      color: #515a6e;
      font-size: 12px;
      padding-top: 7px;
      img {
        width: 100px;
        height: 100px;
      }
    }
    .radio {
      margin-right: 50px;
    }
  }
  .modal-footerRight {
    text-align: right;
  }
}
</style>